<script>

    $.ajax({
        url: './mysql/query.php?query=' + 'listar_asistencia',
        data: null,
        dataType: 'json',
        success: function(data)
        {
            mostrarFilasAusencia(data);
        },
        failure: function(response) {
            console.log("failure:" + response)
        },
        error: function(response) {
            console.log(response.status)
            if (response.status === 401) {
                $("#content").html("Usuario no autorizado");
            }

        }

    });

    function mostrarFilasAusencia(data) {
        $("tr.ausencia").remove();
        $.each(data, function(indice, valor) {
            
            var cadena = jsonToString(valor);
            

            var tr = '<tr class="ausencia" id="' + valor.id_ausencia + '">'
                    +'<td>' + valor.cedula + '</td>'
                    + '<td>' + valor.nombre + '</td>'
                    + '<td>' + valor.apellido + '</td>'
                    + '<td>' + moment(valor.fecha).format("DD-MM-YYYY HH:MM:SS") + '</td>'
                    + '<td>' + valor.tipo + '</td>'
                    +'</tr>';

            $("#tablePersonal").append(tr);
            $(":button").tooltip();

        });
    }

    
    function buscar(campo) {
        var url = "";

        if (campo === "cedula") {
            url = './mysql/query.php?query=' + 'listar_asistencia_cedula&valor=' + "'" + $('#inputFilter').val() + "'"
        }

        $.ajax({
            url: url,
            data: null,
            dataType: 'json',
            success: function(data)
            {
                console.log(data);
                if (data != '{"result":0}') {
                    mostrarFilasAusencia(data);
                } else {
                    $("tr.ausencia").remove();
                }
            },
            failure: function(response) {
                console.log("failure:" + response)
            },
            error: function(response) {
                console.log(response.status)
                console.log(response)
                if (response.status === 401) {
                    $("#content").html("Usuario no autorizado");
                }

            }

        });
    }

</script>


<div id="content" class="hero-unit">
    <div class="input-append">
        <input class="input-large" id="inputFilter" type="text">
        <div class="btn-group">
            <button style="font-size: 19px" class="btn dropdown-toggle" data-toggle="dropdown">
                Buscar por
                <i class="icon-search"></i>
            </button>
            <ul class="dropdown-menu">
                <li><a href="javascript:buscar('cedula')">Cedula</a></li>
            </ul>
        </div>
    </div>
    
    <table class="table table-striped" id="tablePersonal">
        <thead>
            <tr>
                <th> Cedula</th>
                <th> Nombre</th>
                <th> Apellido</th>
                <th> Fecha  </th>
                <th> Tipo  </th>
            </tr>
        </thead>
    </table>
</div>

